{% extends "base_min.html" %}

{% block head %}
  <script type='text/javascript'>
    var vol = {};  // Namespace for calendar
  </script>
  {# can't combine with other JS, because that would go through a proxy, breaking IP-base location sniffing #}
  <script src='http://www.google.com/jsapi?key={{ maps_api_key }}' type='text/javascript'></script>

{% if optimize_page %} 
  {# TODO: custom django template tag: #}
  {# % suprfetch 'script' '/js/third_party/jquery-1.3.2.js', '/js/homepage.js', ... % #}
  <script type='text/javascript' src='http://www.gmodules.com/ig/proxy?url=http%3A%2F%2Fsuprfetch.appspot.com%2F%3Furl%3D{{host}}%2Fzx{{version}}%2Fjs%2Fthird_party%2Fjquery-1.3.2.min.js%26url%3D{{host}}%2Fzx{{version}}%2Fjs%2Fthird_party%2Fjquery.json-1.3.min.js%26url%3D{{host}}%2Fzx{{version}}%2Fjs%2Fthird_party%2Frsh.js%26url%3D{{host}}%2Fzx{{version}}%2Fjs%2Fthird_party%2Fjquery.autocomplete.js%26url%3D{{host}}%2Fzx{{version}}%2Fjs%2Fthird_party%2Fjquery.simplemodal.js%26url%3D{{host}}%2Fzx{{version}}%2Fjs%2Futils.js%26url%3D{{host}}%2Fzx{{version}}%2Fjs%2Fsearch_query.js%26url%3D{{host}}%2Fzx{{version}}%2Fjs%2Fhomepage.js%26url%3Dhttp%3A%2F%2Fs7.addthis.com%2Fjs%2F250%2Faddthis_widget.js%26jsmin%3Dtrue'>
  </script>
{% else %}
  <script type='text/javascript' src='/zx{{version}}/js/third_party/jquery-1.3.2.min.js'></script>
  <script type='text/javascript' src='/zx{{version}}/js/third_party/jquery.json-1.3.min.js'></script>
  <script type='text/javascript' src='/zx{{version}}/js/third_party/rsh.js'></script>
  <script type='text/javascript' src='/zx{{version}}/js/third_party/jquery.autocomplete.js'></script>
  <script type='text/javascript' src='/zx{{version}}/js/third_party/jquery.simplemodal.js'></script>
  <script type='text/javascript' src='http://s7.addthis.com/js/250/addthis_widget.js'></script>
  <script type='text/javascript' src='/zx{{version}}/js/utils.js'></script>
  <script type='text/javascript' src='/zx{{version}}/js/search_query.js'></script>
  {# not required for all pages, but harmless and simpler (for development only) #}
  <script type='text/javascript' src='/zx{{version}}/js/homepage.js'></script>
{% endif %}
  <script type='text/javascript'>
    // These components load asynchronously.  We use AsyncLoadManager to
    // queue up function callbacks until each component is loaded.
    var asyncLoadManager = new AsyncLoadManager(
        [ 'map', 'bodyload', 'friendconnect', 'facebook' ]
    );

    // ...and one to queue JS callbacks on body unload event.
    var onUnloadWorkQueue = new WorkQueue();

    var currentPageName = '{{ current_page|escape }}';

    var popularSearches = [ 'Education', 'Health', 'Nature', 'Hunger',
      'Website', 'Seniors', 'Animals' ];

    // Load the Facebook script -- must be done after asyncLoadManager created
    $.getScript("http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php",
      function() { console.log("getScript CB called"); asyncLoadManager.doneLoading("facebook"); } );
  </script>

{% block js_files %}{% endblock %}
  <link rel='shortcut icon' href='/favicon.ico' />
{% if optimize_page %} 
  <link rel="stylesheet" type="text/css" href='http://www.gmodules.com/ig/proxy?url=http%3A%2F%2Fsuprfetch.appspot.com%2F%3Furl%3D{{host}}%2Fzx{{version}}%2Fcss%2Fmain.css%26url%3D{{host}}%2Fzx{{version}}%2Fcss%2Fjquery.autocomplete.css%26url%3D{{host}}%2Fzx{{version}}%2Fcss%2Fhomepage.css%26cssmin=true'/>
{% else %} 
  <link rel="stylesheet" type="text/css" href='/zx{{version}}/css/main.css'/>
  <link rel="stylesheet" type="text/css" href="/zx{{version}}/css/jquery.autocomplete.css" />
  {# not required for all pages, but harmless and simpler (for development only) #}
  <link rel='stylesheet' type="text/css" href='/zx{{version}}/css/homepage.css'/>
  {% block css_files %}{% endblock %}
{% endif %} 
  <meta name="title" content="All for Good" />
  <meta name="description" content="Each of us has a role to play in improving our communities and our country.  Small actions add up to a big difference.  All for good helps you find and share ways to do good." />
  <link rel="image_src" href="/zx0000/images/afg.gif" />
  
  {# functions for loading google analytics #}
	<script type="text/javascript">
	  function loadGA() {
		  $.getScript('/zx{{version}}/js/third_party/ga.js');
	  }
	  function callGA(){
	    if (typeof _gat != "undefined") {
	      pageTracker = _gat._getTracker('{{ ga_key }}');
	      //custom cookie timeout at 30min - also set in custom ga.js
	      pageTracker._setCookieTimeout(30);
	      pageTracker._trackPageview();
	    } else {
	      $.get('/google_analytics_error');
	    }
	}
	</script>
{% endblock %}{# head #}

{% block body %}
<body onload='asyncLoadManager.doneLoading("bodyload");'>  
 {# note: I tried delaying the gradient until after the search results load. #}
 {# But it was a bad user experience unfortunately-- felt choppy. #}
 <img id='background_top_gradient' src='/zx{{version}}/images/background-gradient.png' alt=''/>

 <center>
 <div id='body_centered'>
  {% include 'header.html' %}
  {% block subheader %}{% endblock %}

  <div>
  <table cellpadding='0' cellspacing='0'>
  <tr>
    <td class='glow_tl'><img alt='' class='glow_tl' src='/zx{{version}}/images/glow-tl.gif'/></td>
    <td class='glow_top'></td>
    <td class='glow_tr'><img alt='' class='glow_tr' src='/zx{{version}}/images/glow-tr.gif'/></td>
  </tr>
  <tr>
    <td class='glow_left'></td>
    <td style='background:white'><div id='content_outer1'><div id='content_outer2'>{% block content_layout %}{% endblock %}</div></div></td>
    <td class='glow_right'></td>
  </tr>
  <tr>
    <td class='glow_bl'><img alt='' class='glow_bl' src='/zx{{version}}/images/glow-bl.gif'/></td>
    <td class='glow_bottom'></td>
    <td class='glow_br'><img alt='' class='glow_br' src='/zx{{version}}/images/glow-br.gif'/></td>
  </tr>
  </table>
  </div>

  {% block prefooter %}{% endblock %}

  {% block footer %}
  <div id='footer'>
    <div id='footer_right'>
      <a href='/about'>About</a> -
      <a href='http://blog.allforgood.org/'>Blog</a> -
      <a href='/help'>Help</a> -
      <a href='/apps'>Apps</a> -
      <a href='http://allforgood.uservoice.com'>Feedback</a> -
      <a href='/docs/api.html'>API</a> - 
      <a href='/posting'>Posting Listings</a> - 
      <a href='/privacypolicy'>Privacy Policy</a> -
      <a href='/tos'>Terms</a>

      <!-- | <a href='/publishers'>Publishers</a> -->
    </div>
    <div>
      &copy; 2009 All for Good
    </div>
  </div>
 {% endblock %}

 </div>
 </center>

  <div id='debug_snippets' style='display:none;'></div>

  <script type='text/javascript'>
    ensureSubmitForm();
    if (currentPageName != 'HOMEPAGE') {
      createExampleSearchText();
    }
    setInputFieldValue(el('keywords'), '');
  </script>
  
  <div id='pleaselogin' style='display:none'>
    <a href='#' title='Close' class='modal_close_x simplemodal-close'>x</a>
    <div class='header'><span>Please sign in</span></div>
    <p class='message'>You need to sign in before liking an opportunity.</p>
    <div class='buttons'>
      <div class='ok'>Ok</div>
    </div>
  </div>

  {# latency: render this after the rest of the page #}
  <div id='login_bar_position'>
    <div id='login_bar'>
      {% include "login_bar.html" %}
    </div>
  </div>

  {# setup autocomplete last #}
  <script>
    $("#keywords").autocomplete("/autocomplete/query");
  </script>

{# setup google analytics on static pages #}
{% ifequal current_page 'STATIC_PAGE' %}
  {% ifnotequal ga_key 'unknown' %}
    <script type="text/javascript">
       // Load analytics on static pages only, done in homepage.js for
       // the homepage and search_results.js for search pages.
      loadGA();
    </script>
  {% endifnotequal %}
{% endifequal %}
</body>

{% endblock %}

